<template>
  <div class="company-style">
    <!-- 导航栏 start -->
    <van-nav-bar title="意见反馈" left-arrow fixed @click-left="$router.back()"/>
    <!-- 导航栏 end -->

    <!-- 内容 -->
    <div class="content-top my-feedback">
      <h3>反馈您的问题</h3>

      <ul>
        <li :class="{'active':typeIndex == 0}" @click="typeIndex=0;feedBackType='功能异常'">功能异常</li>
        <li :class="{'active':typeIndex == 1}" @click="typeIndex=1;feedBackType='产品建议'">产品建议</li>
        <li :class="{'active':typeIndex == 2}" @click="typeIndex=2;feedBackType='吐槽'">吐槽</li>
        <li :class="{'active':typeIndex == 3}" @click="typeIndex=3;feedBackType='其他'">其他</li>
      </ul>

      <van-field v-model="context" rows="10" autosize type="textarea" placeholder="留下您的意见或反馈,我们会不断改进~" style="
          border-radius: 10px;
          margin-bottom: 20px;
          font-size: 16px;
          color: #333;
        " />

      <van-button type="primary" block color="#07f" round style="font-size: 18px" text="提交" @click="save" :loading="subLoading"></van-button>
    </div>
  </div>
</template>

<script>
import { NavBar, Button, Field, Toast } from "vant";
export default {
  name: "LivePlay",
  components: {
    [NavBar.name]: NavBar,
    [Button.name]: Button,
    [Field.name]: Field,
  },
  // 定义属性
  data() {
    return {
			//loading
			subLoading:false,
			//post data
			context:'',
			feedBackType:'功能异常',
			//typeIndex
			typeIndex:0,
		};
  },
  // 方法集合
  methods: {
		save(){
			if(this.context=='' || this.feedBackType==''){Toast('必填项不能为空');return;}
			this.subLoading = true;
			this.$api.post('/PAC/AddFeedBack',{context:this.context,feedBackType:this.feedBackType}).then(res=>{
				this.subLoading = false;
				Toast(res.msg)
			})
		}
	},
};
</script>

<style lang="less">
@import "vant/lib/index.less";
@import "@/assets/css/company.less";
@import "@/assets/css/company.css";
</style>